import React, { PropsWithChildren } from 'react';
import { connect } from 'react-redux';
import { RouteComponentProps } from 'react-router-dom';
// interface Params { }
// type Props = PropsWithChildren<RouteComponentProps<Params>>;
// function Home(props: Props) {
//     return (
//         <div>
//             Home
//         </div>
//     )
// }
// export default connect(
// )(Home);
import actions from '@/store/actions/home';
import HomeHeader from './components/HomeHeader';
import { CombinedState } from '@/store/reducers';
import { HomeState } from '@/store/reducers/home';
import HomeSliders from "./components/HomeSliders";
// import './index.less';
type StateProps = ReturnType<typeof mapStateToProps>;
type DispatchProps = typeof actions;
interface Params { }
type Props = PropsWithChildren<RouteComponentProps<Params> & StateProps & DispatchProps>;
function Home(props: Props) {
    const homeContainerRef = useRef(null);
    return (
        <>
            <HomeHeader
                currentCategory={props.currentCategory}
                setCurrentCategory={props.setCurrentCategory}
            />
            <div className="home-container" ref={homeContainerRef}>
                <HomeSliders sliders={props.sliders} getSliders={props.getSliders} />
            </div>
        </>
    )
}
let mapStateToProps = (state: CombinedState): HomeState => state.home;
export default connect(
    mapStateToProps,
    actions
)(Home);